DC.views.SearchForm = Ext.extend(Ext.form.FormPanel, {
    defaultInstructions: 'Please enter the information above.',
    initComponent: function(){
        fields = {
            xtype: 'fieldset',
            id: 'userFormFieldset',
            defaults: {
                labelAlign: 'left',
                labelWidth: '40%',
                required: false,
                useClearIcon: true,
                autoCapitalize : false
            },
            items: [{
                xtype: 'textfield',
                name : 'keyword',
                label: 'Enter keyword',
                autoCapitalize : true
            },
            {
                xtype: 'selectfield',
                name : 'category',
                label: 'Category',
                options: [
                {
                    text: 'First Option',  
                    value: 'first'
                },

                {
                    text: 'Second Option', 
                    value: 'second'
                },

                {
                    text: 'Third Option',  
                    value: 'third'
                }
                ],
                autoCapitalize : true
            },
            {
                xtype: 'textfield',
                name : 'from',
                label: 'From',
                autoCapitalize : true
            },
            {
                xtype: 'textfield',
                name : 'to',
                label: 'To',
                autoCapitalize : true
            }
            ]
			
        }
		
        Ext.apply(this, {
            scroll: 'vertical',
            items: [ fields ]
        });
		
        DC.views.SearchForm.superclass.initComponent.call(this);
    }
})

Ext.reg('searchform', DC.views.SearchForm);
